<<template>
  <div style="background-color: #f2f2f2;">
      <div :key="index" v-for="(item,index) in helpList" @click="openColumnDetail(item.columnId,index)" class="ub ub-ver width-fulls f14 bg_w font-color-black">
	    	<div class="ub ub-ac ub-pc ticket-height ticket-border">
	    		<div class="ub ub-f1 ub-ac">
	    			<div class="margin-l1 changjian">{{item.newsTitle}}</div>
	    		</div>
	    		<div class="ub ub-ac ub-pe">
	    			<div><img class="ub icon-back-size img4" src="../passengers/arrow_right@2x.png" alt="header-l-icon"/></div>
	    		</div>
	    	</div>
	    </div>
  </div>
</template>

<script type="text/ecmascript-6">
import { mapState } from 'vuex';
export default {
  data: () => {
    return {
      helpList: []
    }
  },
  methods: {
    openColumnDetail: function (columnId, index) {
      let content = {
        'columnId': columnId + '',
        'detail': this.helpList[index].content,
        'listTitle': this.helpCenter.listTitle,
        'detailTitle': this.helpList[index].newsTitle,
        'newsTypeId': this.helpList[index].newsTypeId,
        'firstDate': this.helpCenter.firstDate,
        'secondDate': this.helpList
      }
      this.$store.commit('sethelpCenter', content)
      this.$router.push('/helpCenterDetail')
    }
  },
  created: function () {
    let self = this;
    this.$store.commit('changeHeader', {
      left: '返回',
      right: '',
      middle: self.helpCenter.listTitle,
      ifshow: true,
      leftAction: '-1',
      leftIcon: 'leftIcon',
      rightAction: '',
      rightIcon: ''
    });
    console.log(this.helpCenter)
    if (this.helpCenter.secondDate.length > 0) {
      this.helpList = this.helpCenter.secondDate;
    } else {
      let content = {
        'isBill': 'false',
        'columnId': self.helpCenter.columnId + '',
        'pageNo': '1',
        'pageSize': '10'
      }
      let data = this.$utils.getUserContent(content);
      this.$store.commit('showLoading');
      this.$http.post(this.$RS.helpCenterDetail, data).then(
        function (res) {
          // 响应成功回调
          this.$store.commit('closePop');
          res = res.body;
          console.log(res);
          if (res.code === 1000) {
            this.helpList = res.content.list;
          } else {
            console.log('out');
            this.$store.commit('closePop');
            this.$store.dispatch('showTx', { text: res.message });
          }
        },
        function (err) {
          this.$store.commit('closePop');
          // 响应错误回调
          this.$store.dispatch('showTx', { text: err.message || '网络错误，请重试' });
        }
      );
    }
  },
  computed: mapState(['loginData', 'helpCenter'])
}
</script>

<style lang="stylus">
@import '../../stylus/base.styl';

.width-fulls {
  width: 100%;
}

.margin-t3 {
  margin-bottom: f_times(1);
}

.font-color-black {
  color: #333;
}

.ticket-height {
  height: f_times(3.5);
}
</style>

